// 侧边 config

$e-header-fixed-z-index: e-get($e-header-config, client, desktop, fixed, z-index);

$e-aside-menu-dropdown-submenu-width: 245px;

$e-aside-config: (
    base: (
        default: (
            // 宽度，demo1/_config.scss中定义
            width: $e-aside-default-width
        ),
        fixed: (
            z-index: 101,
            scroll: (
                // 滚动条宽度
                width: 4px
            )
        ),
        minimize: (
            // 收起后宽度
            width: $e-aside-minimize-width,
            transition: all .3s ease
        ),
        // pad & 手机 显示 & 隐藏菜单
        offcanvas-mobile: (
            layout: (
                self: (
                    zindex: 1001,
                    width: 275px
                ),
                close: (
                    size: 25px,
                    font-size: 1.4rem
                )
            ),
            skin: (
                self: (
                    bg-color: #fff,
                    shadow: 0 1px 9px -3px rgba(0, 0, 0, .75)
                ),
                overlay: (
                    bg-color: rgba(#000000, .1),
                ),
                close: (
                    icon-color: (
                        default: #968ad4,
                        hover: #fff
                    ),
                    bg-color: (
                        default: darken(#f8f8fb, 5%),
                        hover: e-brand-color()
                    )
                )
            )
        )
    ),
    menu: (
        base: (
            class: e-aside-menu, // 菜单class
            parent-class: e-aside // 菜单父元素class
        ),
        build: (
            // 布局
            layout: (
                // 默认
                default: (
                    // ul.e-menu-nav
                    self: (
                        padding: 15px 0
                    ),
                    // 一级菜单
                    item: (
                        self: (
                            margin: 0
                        ),
                        // 链接
                        link: (
                            self: (
                                // height & padding
                                height: 44px,
                                padding: 9px 25px
                            ),
                            // 图标
                            icon: (
                                width: 35px,
                                svg-width: 23px,
                                font-size: 1.3rem
                            ),
                            // link bullet
                            bullet: (
                                self: (
                                    width: 15px,
                                ),
                                dot: (
                                    size: 4px
                                ),
                                line: (
                                    width: 5px,
                                    height: 1px
                                )
                            ),
                            // link text
                            text: (
                                font-size: 1rem,
                                font-weight: 400,
                                font-transform: initial
                            ),
                            // link arrow
                            arrow: (
                                width: 20px,
                                transition: all .3s ease,
                                font-size: .7rem
                            ),
                            // link badge
                            badge: (
                                padding: 0 0 0 5px
                            )
                        ),
                        // 子菜单
                        submenu: (
                            self: (
                                indent: 15px,
                                margin: 0
                            ),
                            // 子菜单的菜单项
                            item: (
                                self: (
                                    margin: 0
                                ),
                                link: (
                                    self: (
                                        height: 40px,
                                        padding: 0 25px,
                                        // 往右偏移25px
                                        padding-x: 25px
                                    ),
                                    // 图标
                                    icon: (
                                        width: 35px,
                                        svg-width: 24px,
                                        font-size: 1.3rem
                                    ),
                                    // 菜单左侧的 横线 跟 圆点
                                    bullet: (
                                        self: (
                                            width: 15px,
                                        ),
                                        dot: (
                                            size: 4px
                                        ),
                                        line: (
                                            width: 5px,
                                            height: 1px
                                        )
                                    ),
                                    // 链接文字
                                    text: (
                                        font-size: 1rem,
                                        font-weight: 400,
                                        font-transform: initial
                                    ),
                                    // 右侧的箭头
                                    arrow: (
                                        width: 20px,
                                        transition: all .3s ease,
                                        font-size: .7rem
                                    ),
                                    // 徽章
                                    badge: (
                                        padding: 0 0 0 5px
                                    )
                                )
                            ),
                        )
                    ),
                ),
                // 收起 mode
                minimize: (
                    self: (
                        padding: 15px 0,
                        width: $e-aside-minimize-width,
                    ),

                    // 一级
                    item: (
                        self: (
                            zindex:	$e-header-fixed-z-index - 1,
                            width: $e-aside-menu-dropdown-submenu-width + $e-aside-minimize-width + 1,
                        ),

                        // link
                        link: (
                            // 徽章
                            badge: (
                                right: 7px,
                                size: 6px
                            )
                        ),

                        // 子菜单
                        submenu: (
                            self: (
                                width: $e-aside-menu-dropdown-submenu-width,
                                margin-left: $e-aside-minimize-width + 1
                            ),

                            // parent item
                            parent-item: (
                                self: (
                                    margin:	0
                                ),

                                // link
                                link: (
                                    self: (
                                        height: 40px,
                                        margin-bottom: 0,
                                        padding: 0 30px 10px 30px
                                    ),
                                    // 链接
                                    text:	(
                                        font-size: 1.05rem,
                                        font-weight: 400,
                                        font-transform:	initial
                                    ),
                                    // 徽章
                                    badge:	(
                                        padding: 0 0 0 5px
                                    )
                                )
                            )
                        )
                    )
                )
            ),
            // 皮肤
            skins: (
                dark: (
                    // default
                    default: (
                        self: (
                            bg-color: e-get($e-state-colors, dark, base)
                        ),
                        // root item
                        item: (
                            // item itself
                            self: (
                                bg-color: (
                                    default: null,
                                    open: null,
                                    here: null,
                                    active: null,
                                    hover: null
                                )
                            ),
                            // item link
                            link: (
                                // link itself
                                self: (
                                    bg-color: (
                                        default: transparent,
                                        // 菜单打开
                                        open: #092136,
                                        //
                                        here: #092136,
                                        active: #092136,
                                        hover: #092136
                                    )
                                ),
                                // link icon
                                icon: (
                                    font-color: (
                                        default: #494b74,
                                        open: e-brand-color(),
                                        here: e-brand-color(),
                                        active: e-brand-color(),
                                        hover: e-brand-color()
                                    ),
                                ),
                                // link bullet
                                bullet: (
                                    dot: (
                                        bg-color: (
                                            default: #5c5e81,
                                            open: e-brand-color(),
                                            here: e-brand-color(),
                                            active: e-brand-color(),
                                            hover: e-brand-color()
                                        )
                                    ),
                                    line: (
                                        bg-color: (
                                            default: #5c5e81,
                                            open: e-brand-color(),
                                            here: e-brand-color(),
                                            active: e-brand-color(),
                                            hover: e-brand-color()
                                        )
                                    )
                                ),
                                // link text
                                text: (
                                    font-color: (
                                        default: #a2a3b7,
                                        open: #fff,
                                        here: #fff,
                                        active: #fff,
                                        hover: #fff
                                    )
                                ),
                                // link arrow
                                arrow: (
                                    font-color: (
                                        default: #5c5e81,
                                        open: #fff,
                                        here: #fff,
                                        active: #fff,
                                        hover: #fff
                                    )
                                )
                            ),
                            // item submenu
                            submenu: (
                                // submenu self
                                self: (
                                    bg-color: (
                                        default: null,
                                        open: null,
                                        active: null,
                                        hover: null
                                    )
                                ),
                                // submenu item
                                item: (
                                    // item itself
                                    self: (
                                        bg-color: (
                                            default: null,
                                            open: null,
                                            here: null,
                                            active: null,
                                            hover: null
                                        )
                                    ),
                                    // item link
                                    link: (
                                        // link itself
                                        self: (
                                            bg-color: (
                                                default: transparent,
                                                open: #092136,
                                                here: #092136,
                                                active: #092136,
                                                hover: #092136
                                            )
                                        ),
                                        // link icon
                                        icon: (
                                            font-color: (
                                                default: #494b74,
                                                open: e-brand-color(),
                                                here: e-brand-color(),
                                                active: e-brand-color(),
                                                hover: e-brand-color()
                                            )
                                        ),
                                        // link bullet
                                        bullet: (
                                            dot: (
                                                bg-color: (
                                                    default: #5c5e81,
                                                    open: e-brand-color(),
                                                    here: e-brand-color(),
                                                    active: e-brand-color(),
                                                    hover: e-brand-color()
                                                )
                                            ),
                                            line: (
                                                bg-color: (
                                                    default: #5c5e81,
                                                    open: e-brand-color(),
                                                    here: e-brand-color(),
                                                    active: e-brand-color(),
                                                    hover: e-brand-color()
                                                )
                                            )
                                        ),
                                        // link text
                                        text: (
                                            font-color: (
                                                default: #9899ac,
                                                open: #fff,
                                                active: #fff,
                                                hover: #fff
                                            )
                                        ),
                                        // link arrow
                                        arrow: (
                                            font-color: (
                                                default: #5c5e81,
                                                open: #fff,
                                                here: #fff,
                                                active: #fff,
                                                hover: #fff
                                            )
                                        )
                                    )
                                ),
                            )
                        ),
                    ),
                ),
                light: (
                    // 展开 mode
                    default: (
                        // menu panel itself
                        self: (
                            bg-color: e-get($e-state-colors, dark, base)
                        ),
                        // root item
                        item: (
                            // item itself
                            self: (
                                bg-color: (
                                    default: null,
                                    open: null,
                                    here: null,
                                    active: null,
                                    hover: null
                                )
                            ),
                            // item link
                            link: (
                                // link itself
                                self: (
                                    bg-color: (
                                        default: null,
                                        open: #f6f7fd,
                                        here: #f6f7fd,
                                        active: #f6f7fd,
                                        hover: #f6f7fd
                                    )
                                ),
                                // link icon
                                icon: (
                                    font-color: (
                                        default: #c4cff9,
                                        open: e-brand-color(),
                                        here: e-brand-color(),
                                        active: e-brand-color(),
                                        hover: e-brand-color()
                                    ),
                                ),
                                // link bullet
                                bullet: (
                                    dot: (
                                        bg-color: (
                                            default: #c4cff9,
                                            open: e-brand-color(),
                                            here: e-brand-color(),
                                            active: e-brand-color(),
                                            hover: e-brand-color()
                                        )
                                    ),
                                    line: (
                                        bg-color: (
                                            default: #c4cff9,
                                            open: e-brand-color(),
                                            here: e-brand-color(),
                                            active: e-brand-color(),
                                            hover: e-brand-color()
                                        )
                                    )
                                ),
                                // link text
                                text: (
                                    font-color: (
                                        default: darken(#3d4465, 6%),
                                        open: e-brand-color(),
                                        here: e-brand-color(),
                                        active: e-brand-color(),
                                        hover: e-brand-color()
                                    )
                                ),
                                // link arrow
                                arrow: (
                                    font-color: (
                                        default: #c4cff9,
                                        open: e-brand-color(),
                                        here: e-brand-color(),
                                        active: e-brand-color(),
                                        hover: e-brand-color()
                                    )
                                )
                            ),
                            // item submenu
                            submenu: (
                                // submenu self
                                self: (
                                    bg-color: (
                                        default: null,
                                        open: null,
                                        active: null,
                                        hover: null
                                    )
                                ),
                                // submenu item
                                item: (
                                    // item itself
                                    self: (
                                        bg-color: (
                                            default: null,
                                            open: null,
                                            here: null,
                                            active: null,
                                            hover: null
                                        )
                                    ),
                                    // item link
                                    link: (
                                        // link itself
                                        self: (
                                            bg-color: (
                                                default: null,
                                                open: #f8f8fb,
                                                here: #f8f8fb,
                                                active: #f8f8fb,
                                                hover: #f8f8fb
                                            )
                                        ),
                                        // link icon
                                        icon: (
                                            font-color: (
                                                default: #c4cff9,
                                                open: e-brand-color(),
                                                active: e-brand-color(),
                                                hover: e-brand-color()
                                            )
                                        ),
                                        // link bullet
                                        bullet: (
                                            dot: (
                                                bg-color: (
                                                    default: #c4cff9,
                                                    open: e-brand-color(),
                                                    here: e-brand-color(),
                                                    active: e-brand-color(),
                                                    hover: e-brand-color()
                                                )
                                            ),
                                            line: (
                                                bg-color: (
                                                    default: #c4cff9,
                                                    open: e-brand-color(),
                                                    here: e-brand-color(),
                                                    active: e-brand-color(),
                                                    hover: e-brand-color()
                                                )
                                            )
                                        ),
                                        // link text
                                        text: (
                                            font-color: (
                                                default: #3d4465,
                                                open: e-brand-color(),
                                                active: e-brand-color(),
                                                hover: e-brand-color()
                                            )
                                        ),
                                        // link arrow
                                        arrow: (
                                            font-color: (
                                                default: #c4cff9,
                                                open: e-brand-color(),
                                                active: e-brand-color(),
                                                hover: e-brand-color()
                                            )
                                        )
                                    )
                                ),
                            )
                        ),
                    )
                )
            )
        )
    )
);

// 品牌 config
$e-brand-config: (
    base: (
        default: (
            background-color: #272631,
            shadow: 0 1px 9px -3px rgba(0, 0, 0, .2)
        ),
        minimize: (
            width: 26px,
            height: 26px,
            transition: all .3s ease,
            space: 6px,
            radius: 2px,
            color: (
                default: #4e4c5f,
                hover: e-brand-color(),
                active: e-brand-color()
            )
        )
    ),
);

// 品牌皮肤 config
$e-brand-skins-config: (
    dark: (
        background-color: e-get($e-state-colors, dark, base),
        color: #fff,
        tools-color: #0050b3
    ),
    light: (
        background-color: #fff,
        color: #313143,
        tools-color: #b4b8ce
    )
);